<template>
  <div class="execution">
    <basic-container>
      <avue-form
        :option="tableOption"
        @submit="submit"
        v-model="form"
      ></avue-form>
    </basic-container>
  </div>
</template>

<script>
import {
  addItemObj,
  fetchItemList,
  fetchList,
  putItemObj,
} from "@/api/admin/dict";
import { mapGetters } from "vuex";

export default {
  name: "charm",
  data() {
    return {
      tableOption: {
        column: [
          {
            type: "input",
            label: "简介",
            prop: "value",
            component: "avueUeditor",
            slot: true,
            hide: true,
            options: {
              action: "/fastfile/upload/szgk-1256675456",
              props: {
                res: "data", // 解析文件上传后的respose.JSON
                url: "kpath", // 解析responseJSON==> data.fileUrl
              },
            },
            span: 24,
            rules: [
              {
                required: true,
                message: "请输入简介",
                trigger: "blur",
              },
            ],
          },
        ],
      },
      id: "",
      form: {
        id: 0,
      },
    };
  },
  computed: {
    ...mapGetters(["permissions"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permissions.lgk_introductin_add, false),
        delBtn: this.vaildData(this.permissions.lgk_introductin_del, false),
        editBtn: this.vaildData(this.permissions.lgk_introductin_edit, false),
      };
    },
  },
  created() {
    this.getList();
  },
  methods: {
    getList(page, params) {
      this.tableLoading = true;
      fetchList(
        Object.assign(
          {
            current: 1,
            size: 100,
            type: "lgk_Introductin",
          },
          params,
          this.searchForm
        )
      )
        .then((response) => {
          this.id = response.data.data.records[0].id;
          fetchItemList({
            current: 1,
            size: 100,
            dictId: response.data.data.records[0].id,
          }).then((res) => {
            this.form = res.data.data.records[0];
            this.tableLoading = false;
          });
        })
        .catch(() => {
          this.tableLoading = false;
        });
    },

    handleUpdate: function (row, index, done, loading) {
      putItemObj(row)
        .then((data) => {
          this.$message.success("修改成功");
          done();
          this.getList(this.page);
        })
        .catch(() => {
          loading();
        });
    },
    submit: function (row, done, loading) {
      console.log(row, "row");

      if (this.form.id == 0) {
        let obj = {
          dictId: this.id,
          type: "lgk_Introductin",
          description: "洛工控简介",
          value: this.form.value,
          label: "洛工控简介",
          sort: 1,
        };
        addItemObj(obj)
          .then((data) => {
            console.log(data, "data");
            if (data.status == 200) {
              this.$message.success("添加成功");
              done();
              this.getList(this.page);
            }
          })
          .catch(() => {
            loading();
          });
      } else {
        putItemObj(this.form)
          .then((data) => {
            this.$message.success("修改成功");
            done();
            this.getList(this.page);
          })
          .catch(() => {
            loading();
          });
      }
    },
  },
};
</script>
